.top-area{
    padding: 0.75rem;
}

.avatar {
	position: relative;
	width: 2.85rem;
	height: 2.85rem;
	border-radius: 100%;
}

.avatar img {
	width: 100%;
	height: 100%;
}

.vip {
	position: absolute;
	top: 100%;
	left: -0.35rem;
	transform: translateY(-0.4rem);
	font-size: 0.7rem;
	color: #333;
	background: #f2f2f2;
    width: 3.6rem;
	height: 1.1rem;
	border-radius: 0.1rem;
}

.level-status{
    margin-top: 1.8rem;
}

.level-arrow{
    position: relative;
    margin: 0 0.4rem;
}

.la-word{
    position: absolute;
    width: 100%;
    text-align: center;
    top: -0.6rem;
}

.earn-box{
    padding: 0.6rem 0.5rem;
}

.earn-desc{
    margin-top:0.2rem;
}

.earn-detail{
    color: #333;
    padding: 0.5rem;
}

.earn-title{
    color: #999;
    font-size: 0.6rem;
    margin-bottom: 0.2rem;
}

.earn-split{
    position: relative;
    padding: 0 1.2rem;
}

.earn-split::before, .earn-split::after{
    content: '';
    display: inline-block;
    width: 0;
    height: 1.2rem;
    border-left: 1px solid #ddd;
    position: absolute;
    top: 50%;
    transform: translateY(-0.6rem);
}

.earn-split::before {
    left: 0;
}

.earn-split::after {
    right: 0;
}

.title-block{
    background-color: #999;
    width: 0.2rem;
    height: 0.8rem;
    border-radius: 0.1rem;
    margin-right: 0.4rem;
}

.bottom-btn{
    height: 3rem;
}

.bottom-btn>div{
    height: 3rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 0.6rem;
    background-color: #efeff4;
    z-index: 1;
}

.i-know{
    padding: 0.6rem;
    margin-top: 0.5rem;
}

.m-modal>div{
    display: none;
}

.amount-input{
    height: 33px;
    border: 1px solid #ddd;
    border-radius: 0.25rem;
    padding: 0 0.4rem;
}

.amount-input::placeholder{
    color: #ddd;
}

.confirm-btns{
    padding: 15px 0;
}

.confirm-btns>div{
    width: 4.15rem;
}

.confirm-btns>div:last-child{
    background-color: #999;
    margin-left: 1rem;
}
